<template>
	<view>
		<view class="top cflex">
			<view class="top_text">
				待发货/已发货
			</view>
			<image src="/static/dxy-image/wuliu_1@2x.png" mode=""></image>
		</view>

		<view class="goods cflex">
			<image :src="images" mode=""></image>
			<view class="goods_right flex">
				<view class="name">
					{{name}}
				</view>
				<view class="type_name">
					{{type_name}}
				</view>
				<view class="factory_price">
					{{factory_price}}
				</view>
				<view class="num">
					{{num}}
				</view>
			</view>
		</view>

		<view class="order flex">
			<view class="order_tit">
				订单信息
			</view>
			<view class="order_tit">
				订单编号：{{order_num}}
			</view>
			<view class="order_tit">
				创建时间：{{createdate}}
			</view>
			<view class="order_tit">
				订单需求：{{express}}
			</view>
		</view>

		<view class="bottom cflex ">
			<view class="button1 " @tap="call">
				联系客服
			</view>
			<view class="button3 " v-if="status_text=='已发货'">
				填写物流
			</view>
			<!-- <view class="button3 " v-if="status_text=='已发货'">
				查看物流
			</view> -->
			<view class="button3 " v-if="status_text=='已发货'" :data-order_id="order_id" @tap="takeOrder">
				确认收货
			</view>
			<view class="button3 " v-if="status_text=='待发货'" :data-order_id="order_id" @tap="sort">
				提醒发货
			</view>
			<view class="button3 " v-if="status_text=='待评价'" :data-order_id="order_id" @tap="">
				去评价
			</view>
			<view class="button2 " :data-order_id="order_id" @tap="todetail">
				查看订单
			</view>
		</view>

		<view class="zz" v-if="zz==true"></view>
		<view class="callModel" v-if="callModel==true">
			<view class="callModel_tit">
				客服电话
			</view>
			<view class="callModel_Text">
				{{DefaultPhone}}
			</view>
			<view class="callModel_bottom cflex">
				<view class="cancel" @tap="callModelFalse">
					取消
				</view>
				<view class="tocall" @tap="tocall">
					呼叫
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		ajax
	} from '../../ajax.js';
	export default {
		data() {
			return {
				order_id: '',
				images: "",
				name: "不锈钢操作台冰箱",
				type_name: "冷冻  冷藏  冷藏冷冻",
				factory_price: "￥300",
				num: "起订量：3000件",
				order_num: "1234565235645982",
				status_text: "待发货/已发货",
				createdate: "2020-06-09  14：30",
				express: "1000件",
				express_no: "",
				zz: false,
				callModel: false,
				DefaultPhone: '',
			}
		},
		onLoad(e) {
			let that = this
			that.order_id = e.order_id
			that.getDefaultPhone()
		},
		methods: {
			callModelFalse() {
				let that = this
				that.callModel = false
				that.zz = false
			},
			tocall() {
				let that = this
				let phone = that.DefaultPhone
				uni.makePhoneCall({
					phoneNumber: phone //仅为示例
				});
				that.zz = false
				that.callModel = false
			},
			call() {
				let that = this
				that.zz = true
				that.callModel = true
			},
			getDefaultPhone() {
				let that = this
				ajax({
					url: 'order/getDefaultPhone',
					data: {},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						console.log("token", res.data.data)
						that.DefaultPhone = res.data.data
					},
					error: function() {

					}
				});
			},
			getlist() {
				let that = this
				let status = that.type
				let firstNum = that.firstNum
				let num = that.num
				let token = uni.getStorageSync('token')
				ajax({
					url: 'order/myOrder',
					data: {
						token: token,
						firstNum: firstNum,
						num: num,
						status: status
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						console.log("token", res.data.data.data)
						that.list = res.data.data.data
					},
					error: function() {

					}
				});
			},
			sort(e) {
				let that = this
				let order_id = e
				console.log(order_id)
				ajax({
					url: 'order/sort',
					data: {
						//token: uni.getStorageSync('token'),
						order_id: order_id
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						uni.showToast({
							title: "提醒发货成功"
						})
					},
					error: function() {

					}
				});
			},
			takeOrder(e) {
				let that = this
				let order_id = e
				console.log(order_id)
				ajax({
					url: 'order/takeOrder',
					data: {
						token: uni.getStorageSync('token'),
						order_id: order_id
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						uni.showToast({
							title: "确认收货成功"
						})
					},
					error: function() {

					}
				});
			},
			getdetail() {
				let that = this
				let order_id = that.order_id
				ajax({
					url: 'order/getOrder',
					data: {
						order_id: order_id,
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						console.log("token", res.data.data)
						that.images = res.data.data.images
						that.name = res.data.data.name
						that.type_name = res.data.data.type_name
						that.factory_price = res.data.data.factory_price
						that.num = res.data.data.num
						that.order_num = res.data.data.order_num
						that.status_text = res.data.data.status_text
						that.createdate = res.data.data.createdate
						that.express = res.data.data.express
						that.express_no = res.data.data.express_no

					},
					error: function() {

					}
				});
			}
		}
	}
</script>

<style>
	page {
		background-color: #F7F7F7;
	}

	.zz {
		width: 750rpx;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		position: absolute;
		top: 0;
	}

	.callModel {
		width: 620rpx;
		height: 276rpx;
		background-color: #FFFFFF;
		position: absolute;
		top: 471rpx;
		left: 65rpx;
		border-radius: 20rpx;
	}

	.callModel_tit {
		text-align: center;
		font-size: 28rpx;
		color: #333333;
		margin-top: 18rpx;
	}

	.callModel_Text {
		text-align: center;
		font-size: 30rpx;
		color: #FF7427;
		margin-top: 60rpx;
	}

	.callModel_bottom>view {
		width: 50%;
		text-align: center;
		height: 88rpx;
		margin-top: 32rpx;
		line-height: 88rpx;
		font-size: 28rpx;
	}

	.cancel {
		background-color: #F7F7F7;
		border-bottom-left-radius: 20rpx;
	}

	.tocall {
		color: #FFFFFF;
		background-color: #FF7427;
		border-bottom-right-radius: 20rpx;
	}

	.top {
		background-color: #FF7427;
		height: 150rpx;
		justify-content: space-between;
	}

	.top>image {
		width: 147rpx;
		height: 101rpx;
		margin-top: 40rpx;
		margin-right: 65rpx;
	}

	.top_text {
		color: #FFFFFF;
		font-size: 30rpx;
		margin-top: 80rpx;
		margin-left: 22rpx;
	}

	.goods {
		width: 710rpx;
		height: 210rpx;
		background-color: #FFFFFF;
		margin: 27rpx auto;
		border-radius: 20rpx;

	}

	.goods>image {
		width: 149rpx;
		height: 149rpx;
	}

	.goods_right {
		margin-left: 25rpx;
	}

	.name {
		font-size: 28rpx;
		color: #333333;
		margin-top: 18rpx;
	}

	.type_name {
		font-size: 24rpx;
		color: #555555;
		margin-top: 5rpx;
	}

	.factory_price {
		color: #C80000;
		font-size: 28rpx;
		margin-top: 10rpx;
	}

	.num {
		font-size: 28rpx;
		color: #333333;
		margin-top: 15rpx;
	}

	.order {
		width: 710rpx;
		height: 260rpx;
		background-color: #FFFFFF;
		margin: 0 auto;
		padding-top: 10rpx;


	}

	.order_tit {
		font-size: 28rpx;
		color: #333333;
		margin-top: 20rpx;
		margin-left: 20rpx;
	}

	.bottom {
		position: fixed;
		bottom: 0;
		width: 750rpx;
		height: 128rpx;
		background-color: #FFFFFF;

		justify-content: flex-end;
	}

	.bottom>view {
		margin-right: 20rpx;
		width: 160rpx;
		height: 48rpx;
		border-radius: 100rpx;
		font-size: 28rpx;
		line-height: 48rpx;
		text-align: center;
		margin-top: 60rpx;
	}

	/* 联系客服 */
	.button1 {
		border: 1px solid #999999;
		color: #999999;
	}

	/* 查看订单 */
	.button2 {
		background-color: #FF7427;
		color: #FFFFFF;

	}

	/* 提醒发货 填写物流 查看物流 去评价*/
	.button3 {
		border: 1px solid #FF7427;
		color: #FF7427;
	}
</style>
